/*
  学习目标：给props限制类型
  步骤：
   
*/
import React, { Component } from 'react';
// 1. 导入包 prop-types
import PropTypes from 'prop-types';
// 2. 指定固定属性 propTypes = {}
// 3. 指定规则

//
export default class App extends Component {
  render() {
    return (
      <div>
        <Child name="123" title={<h1>123</h1>} zs={{ name: 18, aeg: 18 }}></Child>
      </div>
    );
  }
}

function Child({ name }) {
  return <h1>Child</h1>;
}

Child.propTypes = {
  name: PropTypes.string.isRequired,
  // 标签或组件
  title: PropTypes.element,
  zs: PropTypes.shape({
    name: PropTypes.string,
    age: PropTypes.number,
  }),
};

// 1. prop-types
// 2. 指定规则对象:  组件名.propTypes = { 💥 固定属性名propTypes, 一个单词都不能打错
//   props属性名: 类型
// }
